<template>
  <div class="popups">
    <el-dialog
      title="新增交易记录"
      :visible="newexpends"
      width="30%"
      @close="btn"
    >
      <!-- :before-close="handleClose" -->

      <el-form ref="form" :model="form" label-width="80px">
        <el-form-item label="交易类型">
          <el-select v-model="form.tradetype" placeholder="请选择活动区域" size="mini">
            <el-option label="区域一" value="shanghai" />
            <el-option label="区域二" value="beijing" />
          </el-select>
        </el-form-item>
        <el-form-item label="选择店铺">
          <el-input v-model="form.tradeType" size="mini" />
        </el-form-item>
        <el-form-item label="选择用户">
          <el-select v-model="form.order" placeholder="请选择活动区域" size="mini">
            <el-option label="区域一" value="shanghai" />
            <el-option label="区域二" value="beijing" />
          </el-select>
        </el-form-item>
        <el-form-item label="额度">
          <el-input v-model="form.tsAmount" size="mini" />
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button @click="btn">取 消</el-button>
        <el-button type="primary" @click="TheNewDeal">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { newplatformExpense } from '@/api/platformExpense';

export default {
  name: 'Popups',
  props: {
    thenewspendings: {
      type: Object,
      required: true,
    },
    newexpends: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      form: {
        // 额度
        tsAmount: '',
        // 交易类型
        tradeType: '',
        // 选择商铺
        shopName: '',
        // 选择用户
        order: '',
      },
    };
  },

  methods: {
    TheNewDeal() {
      newplatformExpense(this.form).then((res) => {
        this.btn();
      });
    },
    btn() {
      this.$emit('thenewspendings');
      this.$emit('update:newexpends', false);
    },
  },
};
</script>

<style>
.el-form-item{
  margin: 10px;

}

.el-input--mini{
  width: 90%;
}
.el-select{
  width: 100%;
}
</style>
